import React, { useState } from 'react'
import useStore from '@/store/index'
import { Avatar, Dropdown, message, Menu, Modal } from 'antd'
import { useNavigate, Navigate } from 'react-router-dom'
import { Link } from 'react-router-dom'
import Img from '../../assets/images/avatar.jpeg'
import './style.css'

const Home = () => {
  // 将主应用的 userInfo 显示到微应用 home 主页
  interface IVueuserInfo {
    name?: string
    avatar: string
    device: string
    token: string
    sider: {
      opened: boolean
      withoutAnimation: boolean
    }
  }

  const [count, setCount] = useState(0)

  const { useUserStore } = useStore()
  const vueUser = useUserStore.vueUserInfo as IVueuserInfo

  const navigate1 = useNavigate()

  const goToAbout = () => {
    navigate1('/test/test1/test12')
  }

  return (
    <div>
      Hello Home11111111111111111111
      <hr />
      {/* <img className="nihao" src={Img} /> */}
      <div className="nihao"></div>
      <div>{vueUser.name}</div>
      <div>{vueUser.avatar}</div>
      <div>{vueUser.token}</div>
      <div
        onClick={() => {
          goToAbout()
        }}
      >
        goToAbout
      </div>
      <Link to="/test/test1/test12">test12</Link>
      <a href="#/react-app1/test/test1/test12">#/react-app1/test/test1/test12</a>
      <div
        onClick={() => {
          history.pushState({ a: 2 }, 'page 2', '#/test/test1/test12')
        }}
      >
        test12
      </div>
      <div
        onClick={() => {
          setCount(count + 1)
        }}
      >
        {count}
      </div>
      {/* <Navigate to={'/test/test1/test12'}></Navigate> */}
      {/* <Modal
        title="提示"
        visible={true}
        // onOk={handleOk}
        // confirmLoading={confirmLoading}
        // onCancel={handleCancel}
        okText="确认"
        cancelText="取消"
      >
        <p>11111</p>
      </Modal> */}
    </div>
  )
}
export default Home
